<!-- 空调 -->
<template>
  <div class="pad-content-box">
    <div class="t-right" v-if="isPageEdit">
      <el-button type="primary" size="mini" @click="m_IsNotActive = !m_IsNotActive">{{ !m_IsNotActive ? '未生效版本' : '已生效版本' }}</el-button>
    </div>
    <el-collapse v-model="activeNames">
      <el-collapse-item name="1">
        <template slot="title">
          <div class="font-size-16 font-weight-700 padding-left-10">基本信息</div>
        </template>
        <el-form label-width="150px" size="small" label-position="right">
          <el-row>
            <el-col :span="8">
              <el-form-item label="设计单位">
                <el-input v-model="m_Form.designUnit" :disabled="FormDis()" placeholder="请输入" clearable></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="系统集成单位">
                <el-input v-model="m_Form.integratedUnit" :disabled="FormDis()" placeholder="请输入" clearable></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="相关材料">
                <el-button type="text" size="mini" @click="AttachmentClick()">点击查看</el-button>
              </el-form-item>
            </el-col>
            <el-col :span="24" style="text-align: right">
              <el-button type="primary" v-if="!FormDis()" @click="Save()" size="mini">保存</el-button>
            </el-col>
          </el-row>
        </el-form>
        <div style="text-align: right">
          <el-button type="primary" v-if="!FormDis() && model.projectStatus == 1" size="mini" @click="approveSubmit" plain>批量提交</el-button>
          <el-button type="primary" v-if="!FormDis() && model.projectStatus == 2" size="mini" @click="Arraignment" plain>批量提审</el-button>
          <el-button type="primary" v-if="!FormDis()" size="mini" @click="AddSubSystem" plain>添加子系统</el-button>
        </div>
        <el-table :data="m_TableData" style="width: 100%">
          <el-table-column v-for="(col, i) in Columns" :key="i" :prop="col.prop" :label="col.label" :width="col.width ? col.width : null" :align="col.align ? col.align : null" :min-width="col.minwidth ? col.minwidth : null">
            <template slot-scope="scope">
              <div style="cursor: pointer" v-if="col.prop == 'action'">
                <el-button @click="DeviceList(scope.row)" type="text" size="small">设备列表</el-button>
                <el-button v-if="!FormDis()" @click="TableDel(scope.row)" type="text" size="small">删除</el-button>
              </div>
              <div v-else-if="col.prop == 'systemName'">
                <el-button @click="ShowDesc(scope.row)" type="text" size="small">{{ scope.row[col.prop] }}</el-button>
              </div>

              <div v-else>
                {{ col.customRender ? col.customRender(scope.row, scope.row[col.prop]) : scope.row[col.prop] }}
              </div>
            </template>
          </el-table-column>
        </el-table>
      </el-collapse-item>
    </el-collapse>
    <Dialog ref="Dialog"></Dialog>
  </div>
</template>
<script>
import dayjs from 'dayjs';
import { requestTips, askDialog } from '../../../assets/util';
import equipmentManageApi from '../../../api/EquipmentManage';
import projectInfoApi from '../../../api/projectInfo';
import Dialog from './Dialog';
const SystemStatus = [
  {
    value: 1,
    label: '草稿',
  },
  {
    value: 2,
    label: '已提交',
  },
  {
    value: 3,
    label: '已通过',
  },
];
export default {
  components: { Dialog },
  data() {
    return {
      m_Form: {
        businessAttachment: [],
        designUnit: null, //设计单位
        integratedUnit: null, //系统集成单位
      },
      m_WorkMsg: null,
      m_IsNotActive: false, //是否未生效
      m_IsReview: true,
      activeNames: ['1'],
      m_TableData: [],
      model: {},
      projectKey:this.$route.query.projectKey || localStorage.getItem("projectKey"),
    };
  },
  filters: {
    nullVal: function (msg) {
      return msg ? msg : '-';
    },
  },
  //监听属性 类似于data概念
  computed: {
    isPageEdit() {
      return !this.$route.query.taskId;
    },
    Columns() {
      let align = 'center';
      let width = null;
      let columns = [
        {
          label: '子系统名称',
          prop: 'systemName',
          align: 'left',
          width: width,
        },
        {
          label: '质保到期日',
          prop: 'warrantyDate',
          align: align,
          width: width,
          customRender: function (row, text) {
            if (text) return dayjs(text).format('YYYY-MM-DD');
            return '-';
          },
        },
        {
          label: '状态',
          prop: 'systemStatus',
          align: align,
          width: width,
          customRender: function (row, text) {
            let obj = SystemStatus.find(item => {
              return item.value == text;
            });
            if (obj) return obj.label;
            return '-';
          },
        },

        {
          label: '操作',
          prop: 'action',
          align: align,
          width: width,
        },
      ];
      return columns;
    },
  },
  //监控data中的数据变化
  watch: {
    m_IsNotActive: {
      immediate: false,
      deep: true,
      handler(val) {
        this.GetData();
      },
    },
  },
  //接收参数
  props: {
    PROP: {
      type: Object,
      default: null,
    },
  },
  //生命周期 - 创建完成（访问当前this实例）
  created() {},
  //生命周期 - 挂载完成（访问DOM元素）
  mounted() {
    this.GetData();
    this.getProjectInfo();
  },
  //方法集合
  methods: {
    async getProjectInfo() {
      let res = await projectInfoApi.apiProjectDetail({
        primaryKey:this.projectKey
      });
      this.model = res;
    },
    ShowDesc(item) {
      this.$refs['Dialog'].m_Instruction.vsb = true;
      this.$refs['Dialog'].m_Instruction.form = item;
    },
    approveSubmit() {
      askDialog('确认提交？', async () => {
        let data = {
          workType: 5,
          projectKey: this.projectKey,
          workId: this.m_WorkMsg.workId,
        };
        const res = await projectInfoApi.summitAuditAndSuccess(data);
        requestTips(res, () => {
          this.getProjectInfo();
        });
      });
    },
    Arraignment() {
      let pathUrl = {
        name: 'arraignment-equipmentManage',
        query: {
          ...this.$route.query,
          workId: this.m_WorkMsg.workId,
          primaryKeys: this.PROP.primaryKey,
        },
      };
      let { href } = this.$router.resolve(pathUrl);
      window.open(href);
    },
    //保存系统信息
    Save(form) {
      console.log(form, this.m_Form);
      equipmentManageApi.procupdate({ ...(form || this.m_Form) }).then(res => {
        this.$refs['Dialog'].m_AttachmentMaterials.vsb = false;
        this.GetData();
      });
    },
    //查看相关材料
    AttachmentClick() {
      this.$refs['Dialog'].m_AttachmentMaterials.vsb = true;
      this.$refs['Dialog'].m_AttachmentMaterials.form = this.m_Form;
    },
    //状态为拆除的不可编辑
    FormDis(item) {
      if (this.m_IsReview) return this.m_IsReview;
      if (item) return !this.m_IsNotActive || item.status == 2;
      else return !this.m_IsNotActive;
    },
    //查询系统信息
    GetNotActive() {
      equipmentManageApi.proclist({  primaryKeys: [this.PROP.primaryKey] }).then(res => {
        if (res && res.rows.length > 0) {
          this.m_Form.businessAttachment = res.rows[0].businessAttachment;
          this.m_Form.designUnit = res.rows[0].designUnit;
          this.m_Form.integratedUnit = res.rows[0].integratedUnit;
        }
      });
      equipmentManageApi.proclist({ workId: this.m_WorkMsg.workId, parentPrimaryKey: this.PROP.primaryKey, status: 1 }).then(res => {
        this.m_TableData = res.rows;
      });
    },

    GetData() {
      console.log(this.PROP.systemName);
      if (this.m_IsNotActive) {
        //未生效
        // if (this.m_WorkMsg && this.m_WorkMsg.procStatus == 2) {
        //   this.$message.warning('当前资产审核中！');
        //   return;
        // }
        equipmentManageApi.getWorkId({ projectKey: this.projectKey, workType: 5, systemType: this.PROP.systemType }).then(res => {
          //1-待审核//2-审核中//3-通过//4-不通过
          this.m_IsReview = false;
          if (res.procStatus == 2) {
            this.$message.warning('当前资产审核中！');
            this.m_IsReview = true;
          }
          this.m_WorkMsg = res;
          this.GetNotActive();
        });
      } else {
        //已生效
        equipmentManageApi.list({ primaryKeys: [this.PROP.primaryKey], rootPrimaryKey: this.PROP.rootPrimaryKey }).then(res => {
          if (res.rows.length) {
            this.m_Form = res.rows[0];
            equipmentManageApi.list({ parentPrimaryKey: this.m_Form.primaryKey }).then(res => {
              this.m_TableData = res.rows;
            });
          } else {
            for (let key in this.m_Form) {
              this.m_Form[key] = null;
            }
          }
        });
      }
    },
    //添加子系统
    AddSubSystem() {
      for (let key in this.$refs['Dialog'].m_Addsubsystem.form) {
        this.$refs['Dialog'].m_Addsubsystem.form[key] = null;
      }
      this.$refs['Dialog'].m_Addsubsystem.vsb = true;
      this.$refs['Dialog'].m_Addsubsystem.IsAdd = true;
    },

    DeviceList(row) {
      this.$refs['Dialog'].m_DeviceInfor.form = row;
      this.$refs['Dialog'].GetDeviceData();
      this.$refs['Dialog'].m_DeviceInfor.vsb = true;
    },
    TableDel(row) {
      this.$confirm('是否确认删除', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        equipmentManageApi.renewal({ primaryKey: row.primaryKey }).then(res => {
          this.GetData();
        });
      });
    },
  },
};
</script>
<style scoped>
/* @import url(); 引入css类 */
</style>